<!-- 报警列表搜索 -->
<template>
  <div class="import-box">
    <el-dialog
      title="导入"
      :before-close="handleClose"
      width="300px"
      :model-value="dialogImportVisible"
      @open="handleOpen"
    >
      <input id="files" type="file" v-on:change="onChange" />
      <div style="display: flex; margin-top: 20px; margin-left: 50%">
        <el-button style="" @click="downLoadImportModel">下载模板</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script setup>
import { ref } from "vue";
import * as XLSX from "xlsx";
import { formatJson } from "@/utils/validate";
const props = defineProps({
  dialogImportVisible: Boolean,
});
const emit = defineEmits(["changeTable", "close"]);

//下载模板
const downLoadImportModel = () => {
  let a = document.createElement("a");
  a.href = "试题导入.xls";
  a.download = "试题导入.xls";
  a.style.display = "none";
  document.body.appendChild(a);
  a.click();
  a.remove();
};
const onChange = (event) => {
  // FileReader 对象允许Web应⽤程序异步读取存储在⽤户计算机上的⽂件（或原始数据缓冲区）的内容
  let fileReader = new FileReader();
  var file = event.currentTarget.files[0];
  let that = this;
  // 回调函数
  fileReader.onload = (ev) => {
    try {
      let data = ev.target.result;
      let workbook = XLSX.read(data, {
        type: "binary",
      });
      // excel读取出的数据
      let excelData = XLSX.utils.sheet_to_json(
        workbook.Sheets[workbook.SheetNames[0]]
      );
      // 将上⾯数据转换成 table需要的数据
      let arr = [];
      excelData.forEach((item) => {
        let obj = {};
        obj.dnl1 = item["示值尖"];
        obj.dnl2 = item["示值峰"];
        obj.dnl3 = item["示值平"];
        obj.dnl4 = item["示值谷"];
        obj.dnl5 = item["示值深谷"];
        // obj.dnlz = item["示值总"];
        obj.last1 = item["上月尖"];
        obj.last2 = item["上月峰"];
        obj.last3 = item["上月平"];
        obj.last4 = item["上月谷"];
        obj.last5 = item["上月深谷"];
        // obj.lastTotal = item["上月总"];
        // obj.dnl1wg = item["示值无功尖"];
        // obj.dnl2wg = item["示值无功峰"];
        // obj.dnl3wg = item["示值无功平"];
        // obj.dnl4wg = item["示值无功谷"];
        // obj.dnl5wg = item["示值无功深谷"];
        obj.dnlzwg = item["示值无功总"];
        // obj.last1wg = item["上月无功尖"];
        // obj.last2wg = item["上月无功峰"];
        // obj.last3wg = item["上月无功平"];
        // obj.last4wg = item["上月无功谷"];
        // obj.last5wg = item["上月无功深谷"];
        obj.lastTotalwg = item["上月无功总"];
        obj.vx1 = item["需量尖"];
        obj.vx2 = item["需量峰"];
        obj.vx3 = item["需量平"];
        obj.vx4 = item["需量谷"];
        obj.vx5 = item["需量深谷"];
        obj.vxz = item["需量总"];
        obj.vxLast1 = item["上月需量尖"];
        obj.vxLast2 = item["上月需量峰"];
        obj.vxLast3 = item["上月需量平"];
        obj.vxLast4 = item["上月需量谷"];
        obj.vxLast5 = item["上月需量深谷"];
        obj.vxLastTotal = item["上月需量总"];
        obj.vx1wg = item["无功需量尖"];
        obj.vx2wg = item["无功需量峰"];
        obj.vx3wg = item["无功需量平"];
        obj.vx4wg = item["无功需量谷"];
        obj.vx5wg = item["无功需量深谷"];
        obj.vxzwg = item["无功需量总"];
        obj.vxLast1wg = item["无功上月需量尖"];
        obj.vxLast2wg = item["无功上月需量峰"];
        obj.vxLast3wg = item["无功上月需量平"];
        obj.vxLast4wg = item["无功上月需量谷"];
        obj.vxLast5wg = item["无功上月需量深谷"];
        obj.vxLastTotalwg = item["无功上月需量总"];
        // obj.meterId = item["表位"];
        arr.push(obj);
      });
      emit("changeTable", arr);
    } catch (e) {
      window.alert("⽂件类型不正确！");
      return false;
    }
  };
  // 读取⽂件成功后执⾏上⾯的回调函数
  fileReader.readAsBinaryString(file);
};
//关闭弹窗
const handleClose = () => {
  emit("close");
};
const handleOpen = () => {
  document.getElementById("files").value = "";
};
</script>
<style lang="scss" scoped>
.export-box {
  display: inline-block;
}
.export {
  width: 260px;
  margin: 0 auto;
}
</style>
